<template>
	<view class="page-backgroud">
		<view class="blue-column-border-box">
			<view class="blue-border"></view>
			<view class="blue-text" v-if="canpingjia">就诊信息</view>
			<view class="blue-text" v-else>我的评价</view>
		</view>
		<view class="appoint-record-box" >
			<view class="appoint-info">
				<text class="left balck-text">医生：</text>
				<text class="right"> {{doctorName}}</text>
			</view>
			<view class="appoint-info">
				<text class="left balck-text">时间：</text>
				<text class="right"> {{guahaorecored.riqi}} {{guahaorecored.shijian}}</text>
			</view>
			<view class="appoint-info">
				<text class="left balck-text">医院：</text>
				<text class="right"> 中国医科大学附属医院 </text>
			</view>
			<view class="appoint-info">
				<text class="left balck-text">诊室：</text>
				<text class="right"> {{keshiName}}</text>
			</view>
			<view class="appoint-info" v-if="!canpingjia">
				<text class="left balck-text">内容：</text>
				<text class="right"> {{pingjiainfo.score}}</text>
			</view>
			<view class="appoint-info" v-if="!canpingjia">
				<text class="left balck-text">建议：</text>
				<text class="right"> {{pingjiainfo.jianyi}}</text>
			</view>
		</view>
		<view v-if="canpingjia">
			<view class="blue-column-border-box">
				<view class="blue-border"></view>
				<view class="blue-text">对医生评价</view>
			</view>
			<radio-group v-model="pingjiainfo.socre">
			<view>
				<radio value="医生态度差"  class="checkbox-class" id="f1" name="f1" 
				/>
				 <text class="checkbox-text-class">医生态度差</text>
				<radio value="态度一般"  class="checkbox-class" id="f2" name="f1" 
				/>
				 <text class="checkbox-text-class">态度一般</text>
			</view>
			 <view>
				 <radio value="我比较满意" class="checkbox-class" id="f3" name="f1" 
				 />
				  <text class="checkbox-text-class">我比较满意</text>
				 <radio value="非常满意"  class="checkbox-class" id="f4" name="f1"  
				/>
				  <text class="checkbox-text-class">非常满意</text>
			 </view>
			 </radio-group>
			<view class="weui-cell weui-cell_input">
			    <view class="weui-cell__bd">
			        <textarea  class="pingjia"  v-model="pingjiainfo.jianyi"
					/>
			    </view>
			</view>
			<button class="button pingjia-bu" @click="insureAppoint()" >提交评价</button>
		</view>
	</view>
</template>

<script> 
	import {error} from '@/common/js/errorTips.js'
	import {
			getKeshiName,
			findyishengByid,
			quguahao,
			topingjia1,
			addpingjia,
			checkpingjiaexist
	} from '@/common/api/jh/doctor.js'
	export default {
		data() {
			return {
				doctorName:'',
				keshiName:'',
				guahaorecored: {
					riqi: '',
					shijian: ''
				},
				pingjiainfo:{
					jiuzhengbianhao:0,
					score: '我比较满意',
					jianyi: ''
				},
				canpingjia: true
			}
		},
		
		methods: {
			// 点击确定
			insureAppoint: function() {
				console.log("checkbox"+JSON.stringify(this.checkbox1))
				console.log(JSON.stringify(this.pingjiainfo))
				addpingjia(this.pingjiainfo.jiuzhengbianhao,
				this.pingjiainfo.score,
				this.pingjiainfo.jianyi).then(res => {
					if(res.data==1){
						uni.showToast({
							title: '评价成功',
							icon: 'success'
						})
						this.canpingjia = false
					}
				}).catch(() => {
					error('网络故障')
				})
			},
			getKeshiName(keshi){
				getKeshiName(keshi).then(res => {
					this.keshiName = res.data!=''?res.data:keshi
				}).catch(() => {
					error('网络故障')
				})
			},
			findyishengByid(yisheng){
				findyishengByid(yisheng).then(res => {
					this.doctorName = res.data.name!=''?res.data.name:yisheng
				}).catch(() => {
					error('网络故障!')
				})
			},
		},
		onLoad(bijiao) {
			var id = uni.getStorageSync('toPjiuzhengid')
			if(id!=undefined&&id!=0&&id!=null&&id!=''){
				this.pingjiainfo.jiuzhengbianhao = String(id)
				var yisheng = uni.getStorageSync('toPysheng')
				this.doctorName = yisheng
				var keshi = uni.getStorageSync('toPkeshi')
				this.keshiName = keshi
				uni.removeStorageSync("toPjiuzhengid")
				uni.removeStorageSync("toPysheng")
				uni.removeStorageSync("toPkeshi")
				let that = this
				topingjia1(id).then(res => {
					that.guahaorecored = res.data
					checkpingjiaexist(String(id)).then(res => {
						console.log("aaaaaa"+JSON.stringify(res.data))
						if(res.data.jiuzhengbianhao!=""&&res.data.jiuzhengbianhao!=undefined&&res.data.jiuzhengbianhao!=null){
							console.log("aaaexist ")
							that.pingjiainfo.jiuzhengbianhao = Number(res.data.id)
							that.pingjiainfo.score = res.data.score
							that.pingjiainfo.jianyi = res.data.jianyi
							this.canpingjia = false
						}else{
							that.canpingjia = true
						}
					}).catch(() => {
						error('网络故障!')
					})
				}).catch(() => {
					error('网络故障')
				})
				
				
				
			}else{
				uni.navigateTo({
					url: '/pages/yuyue/wodeguahaoRecored'
				})
			}
		}
	}
</script>

<style lang="scss">
	@import '@/common/scss/common.scss';
	@import '@/common/scss/form.scss';
	// 一个个的数据块
	.appoint-record-box {
		@include width-margin(90%, auto);
		border-radius: 6px;
		overflow: hidden;
		background-color: #FFFFFF;
		margin-top: 30rpx;

		.top-title {
			@include width-margin(90%, 80rpx);
			line-height: 80rpx;
			@include row-left-right(50%, 50%);
			@include font-style(16px, 500, $major-color);
			border-bottom: 1px solid $uni-border-color;
		}

		.appoint-info {
			@include width-margin(90%, 70rpx);
			line-height: 70rpx;
			@include row-left-right(20%, 80%);
			@include font-style(16px, 500, $gray-color);
			align-items: center;

			// 当用户还没到就就诊的时间看到的
			.green-text {
				@include font-style(16px, 500, #6EC823);
			}

			// 有失信时的状态颜色
			.red-text {
				@include font-style(16px, 500, #CE1229);
			}

			// 排队号的颜色
			.balck-text {
				@include font-style(16px, 500, #000000);
			}

			// /取消预约按钮
			.cancel-button {
				float: right;
				width: 60px;
				height: 25px;
				line-height: 25px;
				font-size: 14px;
				font-family: '宋体';
				color: #55aaff;
				margin-left: 60%;
				margin-top: 10px;
				margin-bottom: 10px;
			}
		}
	}
	.tuihao-button{
		float: right;
		height: 20px;
		line-height: 20px;
		font-size: 14px;
		font-family: '宋体';
		color: #55aaff;
		margin-left: 31%;
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.appoint-record-box:last-child {
		margin-bottom: 30rpx;
	}
	.loading {
		text-align: center;
		line-height: 80px;
		font-family: '宋体';
		color: #a6a6a6;
	}
	.checkbox-class{
		margin-left: 30px;
		color: blue;
	}
	.checkbox-text-class{
		color: #7A7A7A;
		margin-left: 20px;
		font-size: 18px;
		font-family: '宋体';
	}
	.pingjia{
		height: 100px;
		background-color: white;
		border: 1px solid #55aaff;
		margin: 5px;
		width:95%;
	}
	.pingjia-bu{
		width: 90%;
		margin: 15px;
		background-color: #55aaff;
	}
</style>
